<script setup>
import IndexNavbar from './components/IndexNavbar.vue'
import IndexSwiper from './components/IndexSwiper.vue'
import IndexHot from './components/IndexHot.vue'
import IndexShop from './components/IndexShop.vue'
import PageSkeleton from './components/PageSkeleton.vue'
import { getHomeSwiperAPI, getHomeShopAPI } from '@/apis/home'
import { onLoad } from '@dcloudio/uni-app'
import { ref } from 'vue'

// 获取轮播图
const swiperList = ref([])
const getHomeSwiperData = async () => {
  const { data } = await getHomeSwiperAPI()
  swiperList.value = data
}

// 获取店家
const shopList = ref([])
const getHomeShopData = async () => {
  const { data } = await getHomeShopAPI()
  console.log(data)
  shopList.value = data
}

onLoad(() => {
  getHomeSwiperData()
  getHomeShopData()
})
</script>

<template>
  <!-- 顶部导航栏 -->
  <IndexNavbar />
  <scroll-view refresher-enabled="true" class="scroll-view" scroll-y>
    <PageSkeleton v-if="false" />
    <template v-else>
      <!-- 轮播图 -->
      <IndexSwiper :list="swiperList" />
      <!-- 热门推荐 -->
      <IndexHot />
      <!-- 店家 -->
      <IndexShop :list="shopList" />
    </template>
  </scroll-view>
</template>

<style lang="less">
page {
  background-color: #f7f7f7;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.scroll-view {
  flex: 1;
}
</style>
